<template>
  <div class="accountinfo">
    <el-form
      :inline="true"
      :model="formInline"
      class="demo-form-inline max-width-two"
    >
      <el-form-item label="账户状态">
        <el-select
          v-model="state"
          value-key="value"
          placeholder=""
          @change="changeTypeR"
        >
          <el-option
            v-for="item in states"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="乡镇" style="margin-left: 20px">
        <el-select
          v-model="formInline.region"
          value-key="Township"
          placeholder="全部"
          @change="handleChangeV"
        >
          <el-option
            v-for="item in formInline.options"
            :key="item.Id"
            :value="item"
            :label="item.Township"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="村" style="margin-left: 20px">
        <el-select
          v-model="formInline.village"
          value-key="Village"
          placeholder="全部"
          @change="projec()"
        >
          <el-option
            v-for="item in formInline.Allvillage"
            :key="item.Id"
            :label="item.Village"
            :value="item"
            :blur="addsubmitship"
          />
        </el-select>
      </el-form-item>
      <!-- <el-form-item label="年度">
        <el-date-picker
          v-model="formInline.year"
          type="year"
          placeholder="选择年"
        >
        </el-date-picker>
      </el-form-item> -->
      <el-form-item label="项目名称" style="margin-left: 20px">
        <el-select
          v-model="formInline.projectname"
          value-key="ProjectName"
          placeholder="全部"
          @change="changeTypeR"
        >
          <el-option
            v-for="item in options"
            :key="item.Id"
            :label="item.ProjectName"
            :value="item"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="姓名 / 身份证号" style="margin-left: 20px">
        <el-input
          v-model="formInline.name"
          placeholder=""
          @change="changeTypeR"
        />
      </el-form-item>
      <el-form-item style="margin-left: 20px">
        <!-- <el-button
          class="el-icon-search"
          @click="onSubmit"
          :disabled="isdisable"
          >查询</el-button
        > -->
        <el-radio-group v-model="radio" @change="radChange()">
          <el-radio-button :label="3" @click="onSubmit()"
            ><span
              style="display: block; width: 16px; height: 16px"
              class="el-icon-search"
              >查询</span
            ></el-radio-button
          >
          <el-radio-button :label="1">城居保</el-radio-button>
          <el-radio-button :label="2">职保</el-radio-button>
          <el-radio-button :label="0">其他</el-radio-button>
        </el-radio-group>
        <el-button
          class="el-icon-circle-close"
          style="margin-left: 10px"
          @click="clear"
          >清除筛选条件</el-button
        >
        <!-- <el-button class="el-icon-printer">打印</el-button> -->
      </el-form-item>
    </el-form>
    <!-- <el-form :inline="true">
      <el-form-item style="float: right">
      </el-form-item>
    </el-form> -->
    <div class="elTab">
      <el-table
        :data="
          tableData.slice((currentPage - 1) * pagesize, currentPage * pagesize)
        "
        fit
        border
        highlight-current-row
        @current-change="handleCurrent"
        :header-cell-style="{ 'text-align': 'center', height: '45px' }"
        :cell-style="{ 'text-align': 'center' }"
        :row-style="{ height: '45px' }"
        class="elTable"
        height="calc(100vh - 470px)"
      >
        <el-table-column prop="Name" fixed="left" label="操作" width="160">
          <template slot-scope="scope">
            <div style="display: flex" v-if="scope.row.SocialSecurityType != 1">
              <span
                type="text"
                v-if="
                  scope.row.Status == 1 &&
                  scope.row.businessStatus == 0 &&
                  scope.row.SocialSecurityType != 0
                "
                style="
                  font-size: 14px;
                  color: #409eff;
                  padding: 0 5px;
                  cursor: pointer;
                "
                @click="handleproject(scope.row)"
                >支出登记</span
              >
              <span
                type="text"
                v-if="scope.row.SocialSecurityType == 0"
                style="
                  font-size: 14px;
                  width: 58px;
                  color: #409eff;
                  display: block;
                  padding: 0 5px;
                  margin-left: 7px;
                "
                >&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span
              >
              <span
                type="text"
                v-if="scope.row.Status == 1 && scope.row.businessStatus == 0"
                style="
                  font-size: 14px;
                  color: #409eff;
                  padding: 0 5px;
                  cursor: pointer;
                "
                @click="handleflowing(scope.row)"
                >结算登记</span
              >
            </div>
          </template>
        </el-table-column>
        <el-table-column type="index" label="序号" width="60" />
        <el-table-column prop="Township" label="乡镇" width="120" />
        <el-table-column prop="Village" label="村" width="120" />
        <!-- <el-table-column prop="YearNum" label="年度" width="100" /> -->
        <el-table-column prop="ProjectName" label="项目名称" width="130" />
        <el-table-column prop="SocialSecurityType" label="参保类型" width="120">
          <template slot-scope="scope">
            <div
              style="color: #499eff; cursor: pointer"
              v-if="
                !(
                  scope.row.businessStatus != 0 ||
                  scope.row.Status == 0 ||
                  (scope.row.Status == 5 &&
                    (scope.row.SocialSecurityType == 0 ||
                      scope.row.SocialSecurityType == 2))
                )
              "
              @click="changeType(scope.row)"
            >
              <span v-if="scope.row.SocialSecurityType == 0">其他</span>
              <span v-else-if="scope.row.SocialSecurityType == 1">城居保</span>
              <span v-else-if="scope.row.SocialSecurityType == 2">职保</span>
            </div>
            <div v-else>
              <span v-if="scope.row.SocialSecurityType == 0">其他</span>
              <span v-else-if="scope.row.SocialSecurityType == 1">城居保</span>
              <span v-else-if="scope.row.SocialSecurityType == 2">职保</span>
            </div>
          </template>
        </el-table-column>
        <el-table-column prop="Name" label="姓名" width="90" />
        <el-table-column prop="GenderCode" label="性别" width="60">
          <template slot-scope="scope">
            <div v-if="scope.row.GenderCode == 1">男</div>
            <div v-else>女</div>
          </template>
        </el-table-column>
        <el-table-column prop="IdentityNum" label="身份证号" width="180" />
        <!-- <el-table-column prop="Status" label="账户状态" width="180">
        <template slot-scope="scope">
          <div v-if="scope.row.Status == 1">正常</div>
          <div v-else-if="scope.row.Status == 5">已结算</div>
          <div v-else>初始化</div>
        </template>
      </el-table-column> -->
        <el-table-column prop="Balance" label="账户余额" width="180">
          <template slot-scope="scope">
            {{ number_format(scope.row.Balance, 2) }}
          </template>
        </el-table-column>
        <el-table-column prop="Status" label="账户状态" width="120">
          <template slot-scope="scope">
            <div>
              <span v-if="scope.row.Status == 0">初始化</span>
              <span v-else-if="scope.row.Status == 1">正常</span>
              <span v-else-if="scope.row.Status == 5">已结算</span>
            </div>
          </template>
        </el-table-column>
        <el-table-column prop="businessStatus" label="业务状态" width="120">
          <template slot-scope="scope">
            <div>
              <span v-if="scope.row.businessStatus == 0">-</span>
              <span v-else-if="scope.row.businessStatus == 1">补贴中</span>
              <span v-else-if="scope.row.businessStatus == 2">计息中</span>
              <span v-else-if="scope.row.businessStatus == 3">支出中</span>
              <span v-else-if="scope.row.businessStatus == 4">结算中</span>
              <span v-else-if="scope.row.businessStatus == 5">调整中</span>
            </div>
          </template>
        </el-table-column>
        <el-table-column prop="PhoneNum" label="联系电话" width="130" />
        <el-table-column prop="BankName" label="开户银行" width="180" />
        <el-table-column prop="BankAccount" label="银行账号" width="180" />
        <el-table-column prop="BankAccount" label="业务流水" width="150">
          <template slot-scope="scope">
            <div>
              <span
                style="
                  font-size: 14px;
                  color: #409eff;
                  padding: 0 5px;
                  cursor: pointer;
                "
                @click="handleCurrentqqq(scope.row)"
                >预览</span
              >
            </div>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page="currentPage"
      :page-sizes="[10, 50, 100, 200]"
      :page-size="pagesize"
      layout="total, sizes, prev, pager, next, jumper"
      :total="this.tableData.length"
    >
    </el-pagination>
    <!-- 支出登记征地项目详情模态框 -->
    <el-dialog
      title=""
      :visible.sync="project"
      class="land"
      width="580px"
      style="padding: 0 20px"
    >
      <el-form
        :model="gridData"
        inline
        :label-position="labelPosition1"
        label-width="70px"
        class="demo-form-inline bigBan"
      >
        <el-form-item label="姓名">{{ gridData.Name }}</el-form-item>
        <el-form-item label="乡镇" style="margin-left: 20px">{{
          gridData.Township
        }}</el-form-item>
      </el-form>
      <el-form
        :model="gridData"
        inline
        :label-position="labelPosition1"
        label-width="70px"
        class="demo-form-inline bigBan"
      >
        <el-form-item label="性别">{{
          gridData.GenderCode == 1 ? "男" : "女"
        }}</el-form-item>
        <el-form-item label="村" style="margin-left: 20px">{{
          gridData.Village
        }}</el-form-item>
      </el-form>
      <el-form
        :model="gridData"
        inline
        :label-position="labelPosition1"
        label-width="70px"
        class="demo-form-inline bigBan"
      >
        <el-form-item label="身份证号">{{ gridData.IdentityNum }}</el-form-item>
        <el-form-item label="项目名称" style="margin-left: 20px">{{
          gridData.ProjectName
        }}</el-form-item>
      </el-form>
      <el-form
        :model="gridData"
        :label-position="labelPosition1"
        label-width="70px"
        class="demo-form-inline"
        inline
      >
        <el-form-item label="联系电话">
          <el-input v-model="phonenum" placeholder="请输入电话号码"></el-input>
        </el-form-item>
        <el-form-item label="社保类型" style="margin-left: 20px">
          <span v-if="gridData.SocialSecurityType == 0">其他</span
          ><span v-else-if="gridData.SocialSecurityType == 1">城居保</span
          ><span v-else>职保</span>
        </el-form-item>
      </el-form>
      <el-form
        :model="gridData"
        :label-position="labelPosition1"
        label-width="70px"
        class="demo-form-inline"
        :before-close="clearInfo"
      >
        <el-form-item label="开户银行">
          <el-input
            style="width: 350px"
            v-model="inputLines"
            placeholder="请输入开户银行"
          ></el-input>
        </el-form-item>
        <el-form-item label="银行账号"
          ><el-input
            style="width: 350px"
            v-model="inputNumber"
            placeholder="请输入银行账号"
          ></el-input
        ></el-form-item>
        <el-form-item label="账户余额"
          >{{ number_format(gridData.Balance, 2) }}（元）</el-form-item
        >
        <el-form-item label="支出金额">
          <el-input
            v-model="inputMoney"
            type="number"
            placeholder="请输入支出金额"
            maxlength="9"
          />（元）</el-form-item
        >
        <el-form-item label="大写金额">{{
          this.$moneyBig.required(this.inputMoney)
        }}</el-form-item>
        <!-- <el-form-item label="支出时间">{{
          dateToString(new Date())
        }}</el-form-item> -->
        <el-form-item label="备注">
          <el-input
            type="textarea"
            :rows="2"
            maxlength="50"
            placeholder="请输入内容"
            v-model="textarea"
            style="max-width: 350px"
          >
          </el-input>
        </el-form-item>
        <!-- <el-form-item style="text-align: right"
          ><el-button
            :disabled="isdisable"
            @click="determine"
            style="width: 103px"
            >确定</el-button
          ><el-button @click="clearInfo">取消</el-button></el-form-item
        > -->
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="clearInfo">取 消</el-button>
        <el-button
          :disabled="isdisable"
          type="primary"
          style="width: 110px"
          @click="determine()"
          >确 定</el-button
        >
      </span>
    </el-dialog>
    <!-- 结算登记征地项目详情模态框 -->
    <el-dialog
      title=""
      :visible.sync="projectNJS"
      class="land"
      width="1150px"
      :before-close="clearInfo"
    >
      <div class="info">
        <div class="bigForm">
          <el-form
            :model="gridData"
            :label-position="labelPosition"
            label-width="70px"
            class="demo-form-inline bigBan"
            inline
          >
            <el-form-item label="姓名">{{ gridData.Name }}</el-form-item>
            <el-form-item label="乡镇" style="margin-left: 30px">{{
              gridData.Township
            }}</el-form-item>
          </el-form>
          <el-form
            :model="gridData"
            :label-position="labelPosition"
            label-width="70px"
            class="demo-form-inline bigBan"
            inline
          >
            <el-form-item label="性别">{{
              gridData.GenderCode == 1 ? "男" : "女"
            }}</el-form-item
            ><el-form-item label="村" style="margin-left: 30px">{{
              gridData.Village
            }}</el-form-item>
          </el-form>
          <el-form
            :model="gridData"
            :label-position="labelPosition"
            label-width="70px"
            class="demo-form-inline bigBan"
            inline
          >
            <el-form-item label="身份证号">{{
              gridData.IdentityNum
            }}</el-form-item>
            <el-form-item label="项目名称" style="margin-left: 30px">{{
              gridData.ProjectName
            }}</el-form-item>
          </el-form>
          <el-form
            :model="gridData"
            :label-position="labelPosition"
            label-width="70px"
            class="demo-form-inline"
            inline
          >
            <el-form-item label="联系电话">
              <el-input
                v-model="phonenum"
                placeholder="请输入电话号码"
              ></el-input>
            </el-form-item>
            <el-form-item label="参保类型" style="margin-left: 30px">
              <span v-if="gridData.SocialSecurityType == 0">其他</span>
              <span v-else-if="gridData.SocialSecurityType == 1">城居保</span>
              <span v-else-if="gridData.SocialSecurityType == 2">职保</span>
            </el-form-item>
          </el-form>
          <el-form
            :model="gridData"
            :label-position="labelPosition"
            label-width="70px"
            class="demo-form-inline bigBan"
          >
            <el-form-item label="开户银行">
              <el-input
                v-model="inputLines"
                style="width: 360px"
                placeholder="请输入开户银行"
              ></el-input>
            </el-form-item>
            <el-form-item label="银行账号"
              ><el-input
                style="width: 360px"
                v-model="inputNumber"
                placeholder="请输入银行账号"
              ></el-input
            ></el-form-item>
            <el-form-item label="结算原因">
              <el-radio-group
                v-model="radio2"
                @change="changeR"
                style="width: 270px"
              >
                <span
                  ><el-radio :label="1" border size="mini"
                    >出国定居</el-radio
                  ></span
                >
                <span
                  ><el-radio :label="2" border size="mini">死亡</el-radio></span
                >
                <span
                  ><el-radio :label="3" border size="mini"
                    >达到待遇领取条件</el-radio
                  ></span
                >
                <span
                  ><el-radio :label="4" border size="mini"
                    >以灵活就业人员参保并享受待遇</el-radio
                  ></span
                >
                <span
                  ><el-radio :label="5" border size="mini">其他</el-radio></span
                ><span
                  ><el-input
                    :disabled="showqt"
                    style="width: 143px"
                    size="mini"
                    v-model="wriwo"
                    placeholder="请输入原因"
                  ></el-input
                ></span>
              </el-radio-group>
            </el-form-item>
          </el-form>
          <el-form
            :model="gridData"
            :label-position="labelPosition"
            label-width="70px"
            class="demo-form-inline bigBan"
            inline
          >
            <el-form-item label="账户余额"
              >{{ number_format(gridData.Balance, 2) }}（元）</el-form-item
            >
            <el-form-item label="结算利息" style="margin-left: 30px"
              >{{ gridData.InterestMoney }}（元）</el-form-item
            >
          </el-form>
          <el-form
            :model="gridData"
            :label-position="labelPosition"
            label-width="70px"
            class="demo-form-inline bigBan"
          >
            <el-form-item label="结算金额">
              {{ number_format(inputMoney, 2) }}（元）</el-form-item
            >
            <el-form-item label="大写金额"
              ><div style="width: 360px">
                {{ this.$moneyBig.required(this.inputMoney) }}
              </div></el-form-item
            >
            <!-- <el-form-item label="结算时间">{{
              dateToString(new Date())
            }}</el-form-item> -->
            <el-form-item label="备注">
              <el-input
                type="textarea"
                :rows="2"
                maxlength="50"
                placeholder="请输入内容"
                v-model="textarea"
                style="width: 360px; max-height: 58px"
              >
              </el-input>
            </el-form-item>
          </el-form>
        </div>
        <div id="inputcc">
          <el-form
            :model="gridData"
            :label-position="labelPosition"
            label-width="100px"
            class="demo-form-inline"
          >
            <el-form-item label="领取人">
              <el-radio-group
                v-model="radio3"
                @change="changeshow"
                style="width: 200px"
              >
                <el-radio :label="1">本人</el-radio>
                <el-radio :label="2">受益人</el-radio>
              </el-radio-group>
            </el-form-item>
            <el-form-item label="与参保人关系"
              ><el-radio-group
                v-model="radio5"
                @change="changeR5"
                style="width: 290px"
                :disabled="benren"
              >
                <span
                  ><el-radio :label="1" border size="mini">配偶</el-radio></span
                >
                <span
                  ><el-radio :label="2" border size="mini">子女</el-radio></span
                >
                <span
                  ><el-radio :label="3" border size="mini">父母</el-radio></span
                >
                <span
                  ><el-radio :label="4" border size="mini"
                    >兄弟姐妹</el-radio
                  ></span
                >
                <span
                  ><el-radio :label="5" border size="mini"
                    >祖父母</el-radio
                  ></span
                >
                <span
                  ><el-radio :label="6" border size="mini"
                    >外祖父母</el-radio
                  ></span
                >
                <span
                  ><el-radio :label="7" border size="mini">其他</el-radio></span
                ><span
                  ><el-input
                    :disabled="showgx"
                    style="width: 143px"
                    size="mini"
                    placeholder="请输入"
                    v-model="qt"
                  ></el-input
                ></span>
              </el-radio-group>
            </el-form-item>
            <el-form-item label="姓名"
              ><el-input
                style="width: 290px"
                v-model="typeInfo.name"
                :disabled="benren"
                placeholder=""
              ></el-input
            ></el-form-item>
            <el-form-item label="性别">
              <el-radio-group v-model="radio4" :disabled="benren">
                <el-radio :label="1">男</el-radio>
                <el-radio :label="2">女</el-radio>
              </el-radio-group>
            </el-form-item>
            <el-form-item label="身份证号"
              ><el-input
                style="width: 290px"
                v-model="typeInfo.idcard"
                :disabled="benren"
                placeholder=""
              ></el-input
            ></el-form-item>
            <el-form-item label="联系电话"
              ><el-input
                style="width: 290px"
                v-model="typeInfo.phonenum"
                :disabled="benren"
                placeholder=""
              ></el-input
            ></el-form-item>
            <!-- <el-form-item label="户籍地址"
              ><el-input
                style="width: 290px"
                v-model="typeInfo.address"
                :disabled="benren"
                placeholder=""
              ></el-input
            ></el-form-item>
            <el-form-item label="居住地址">
              <el-input
                style="width: 290px"
                v-model="typeInfo.dres"
                :disabled="benren"
                placeholder=""
              ></el-input>
            </el-form-item> -->
            <el-form-item label="开户银行"
              ><el-input
                style="width: 290px"
                v-model="typeInfo.bank"
                :disabled="benren"
                placeholder=""
              ></el-input
            ></el-form-item>
            <el-form-item label="银行账号">
              <el-input
                style="width: 290px"
                v-model="typeInfo.banknum"
                :disabled="benren"
                placeholder=""
              ></el-input>
            </el-form-item>
          </el-form>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="clearInfo">取消</el-button>
        <el-button :disabled="isdisable" @click="determineNJS"
          >确定，打印登记表</el-button
        >
      </span>
    </el-dialog>
    <!-- 参保类型变更 -->
    <el-dialog
      title=""
      :visible.sync="insure"
      class="land"
      width="622px"
      style="padding: 0 20px"
      :before-close="clearInfo"
    >
      <el-form
        :model="gridData"
        inline
        :label-position="labelPosition1"
        label-width="90px"
        class="demo-form-inline bigBan"
      >
        <el-form-item label="姓名">{{ gridData.Name }}</el-form-item>
        <el-form-item label="乡镇" style="margin-left: 20px">{{
          gridData.Township
        }}</el-form-item>
      </el-form>
      <el-form
        :model="gridData"
        inline
        :label-position="labelPosition1"
        label-width="90px"
        class="demo-form-inline bigBan"
      >
        <el-form-item label="性别">{{
          gridData.GenderCode == 1 ? "男" : "女"
        }}</el-form-item>
        <el-form-item label="村" style="margin-left: 20px">{{
          gridData.Village
        }}</el-form-item>
      </el-form>
      <el-form
        :model="gridData"
        inline
        :label-position="labelPosition1"
        label-width="90px"
        class="demo-form-inline bigBan"
      >
        <el-form-item label="身份证号">{{ gridData.IdentityNum }}</el-form-item>
        <el-form-item label="用地项目" style="margin-left: 20px">{{
          gridData.ProjectName
        }}</el-form-item>
      </el-form>
      <el-form
        :model="gridData"
        :label-position="labelPosition1"
        label-width="90px"
        class="demo-form-inline"
      >
        <el-form-item label="联系电话">
          <!-- <el-input v-model="phonenum" placeholder="请输入电话号码"></el-input> -->
          {{ gridData.PhoneNum }}
        </el-form-item>
        <el-form-item label="开户银行">
          <!-- <el-input
            style="width: 350px"
            v-model="inputLines"
            placeholder="请输入开户银行"
          ></el-input> -->
          {{ gridData.BankName }}
        </el-form-item>
        <el-form-item label="银行账号">{{ gridData.BankAccount }}</el-form-item>
        <el-form-item label="原参保类型">
          <span v-if="gridData.SocialSecurityType == 0">其他</span
          ><span v-else-if="gridData.SocialSecurityType == 1">城居保</span
          ><span v-else-if="gridData.SocialSecurityType == 2">职保</span>
        </el-form-item>
        <el-form-item label="新参保类型">
          <el-select
            v-model="newInsure"
            value-key="value"
            placeholder=""
            @change="insureChange"
          >
            <el-option
              v-for="item in newInsures"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item>
      </el-form>
      <el-form
        :model="gridData"
        :label-position="labelPosition1"
        label-width="90px"
        class="demo-form-inline"
        :before-close="clearInfo"
        inline
      >
        <el-form-item label="账户余额"
          >{{ number_format(gridData.Balance, 2) }}（元）</el-form-item
        >
        <el-form-item label="结算利息" v-if="showInsure">
          {{ number_format(gridData.InterestMoney, 2) }}
        </el-form-item>
      </el-form>
      <el-form
        :model="gridData"
        :label-position="labelPosition1"
        label-width="90px"
        class="demo-form-inline"
        :before-close="clearInfo"
      >
        <el-form-item label="结算金额" v-if="showInsure">{{
          number_format(inputMoney, 2)
        }}</el-form-item>
        <el-form-item label="备注">
          <el-input
            type="textarea"
            :rows="2"
            maxlength="50"
            placeholder="请输入内容"
            v-model="textarea"
            style="max-width: 350px"
          >
          </el-input>
        </el-form-item>
        <!-- <el-form-item style="text-align: right">
          <el-button
            :disabled="isdisable"
            @click="changeInsure"
            style="width: 103px"
            >确定</el-button
          ><el-button @click="clearInfo">取消</el-button></el-form-item
        > -->
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="clearInfo">取 消</el-button>
        <el-button
          :disabled="isdisable"
          type="primary"
          style="width: 110px"
          @click="changeInsure()"
          >确 定</el-button
        >
      </span>
    </el-dialog>
    <!-- 账户流水详情模态框 -->
    <!-- <el-drawer
      title="账户流水详情"
      :visible.sync="table"
      direction="rtl"
      size="50%"
    >
      <el-table :data="gridInfo">
        <el-table-column property="address" label="类型" />
        <el-table-column property="address" label="金额" />
        <el-table-column property="address" label="余额" />
        <el-table-column property="address" label="时间" />
        <el-table-column property="address" label="备注" />
      </el-table>
    </el-drawer> -->
    <!-- 流水 -->
    <el-dialog
      title="业务流水详情"
      :visible.sync="projectqqq"
      class="land"
      width="1341px"
      style="padding: 0 20px"
    >
      <el-table
        :data="tableInfo"
        border
        style="width: 100%"
        :header-cell-style="{ 'text-align': 'center' }"
        :cell-style="{ 'text-align': 'center', height: '40px' }"
        :row-style="{ height: '45px', 'line-height': '40px' }"
        height="500px"
      >
        <el-table-column type="index" label="序号" width="180">
        </el-table-column>
        <el-table-column prop="CreateTime" label="操作时间" width="180">
          <template slot-scope="scope">{{
            formatDate(scope.row.CreateTime)
          }}</template>
        </el-table-column>
        <el-table-column prop="BusinessType" label="业务类型" width="130">
          <template slot-scope="scope">
            <div>
              <span v-if="scope.row.BusinessType == 0">账户生成</span>
              <span v-if="scope.row.BusinessType == 1">账户补贴</span>
              <span v-else-if="scope.row.BusinessType == 2">账户计息</span>
              <span v-else-if="scope.row.BusinessType == 3">账户支出</span>
              <span v-else-if="scope.row.BusinessType == 4">账户结算</span>
              <span v-else-if="scope.row.BusinessType == 5">账户调整</span>
            </div>
          </template>
        </el-table-column>
        <el-table-column prop="BusinessMoney" label="金额" width="130">
          <template slot-scope="scope">
            {{
              scope.row.BusinessMoney == 0
                ? "-"
                : number_format(scope.row.BusinessMoney, 2)
            }}
          </template>
        </el-table-column>
        <el-table-column prop="BusinessBalance" label="余额" width="130">
          <template slot-scope="scope">
            {{
              scope.row.BusinessBalance == 0
                ? "-"
                : number_format(scope.row.BusinessBalance, 2)
            }}
          </template></el-table-column
        >
        <el-table-column prop="FinanceDate" label="到账日期" width="180">
          <template slot-scope="scope">
            {{ formatDate(scope.row.FinanceDate).substr(0, 10) }}
          </template>
        </el-table-column>
        <el-table-column prop="Note" label="备注" width="180"></el-table-column>
        <el-table-column
          prop="CreaterName"
          label="操作员"
          width="130"
        ></el-table-column>
      </el-table>
      <span slot="footer" class="dialog-footer">
        <el-button
          :disabled="isdisable"
          type="primary"
          style="width: 110px"
          @click="clearInfo()"
          >确 定</el-button
        >
      </span>
    </el-dialog>
    <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane label="业务流水" name="second">
        <el-table
          :data="tableInfo"
          height="145"
          border
          style="width: 100%"
          :header-cell-style="{ 'text-align': 'center' }"
          :cell-style="{ 'text-align': 'center', height: '40px' }"
          :row-style="{ height: '45px', 'line-height': '40px' }"
        >
          <el-table-column type="index" label="序号" width="180">
          </el-table-column>
          <el-table-column prop="CreateTime" label="操作时间" width="180">
            <template slot-scope="scope">{{
              formatDate(scope.row.CreateTime)
            }}</template>
          </el-table-column>
          <el-table-column prop="BusinessType" label="业务类型" width="130">
            <template slot-scope="scope">
              <div>
                <span v-if="scope.row.BusinessType == 0">账户生成</span>
                <span v-if="scope.row.BusinessType == 1">账户补贴</span>
                <span v-else-if="scope.row.BusinessType == 2">账户计息</span>
                <span v-else-if="scope.row.BusinessType == 3">账户支出</span>
                <span v-else-if="scope.row.BusinessType == 4">账户结算</span>
                <span v-else-if="scope.row.BusinessType == 5">账户调整</span>
                <!-- <span v-else-if="scope.row.BusinessType == 6">账户调减</span> -->
              </div>
            </template>
          </el-table-column>
          <el-table-column prop="BusinessMoney" label="金额" width="130">
            <template slot-scope="scope">
              {{
                scope.row.BusinessMoney == 0
                  ? "-"
                  : number_format(scope.row.BusinessMoney, 2)
              }}
            </template>
          </el-table-column>
          <el-table-column prop="BusinessBalance" label="余额" width="130">
            <template slot-scope="scope">
              {{
                scope.row.BusinessBalance == 0
                  ? "-"
                  : number_format(scope.row.BusinessBalance, 2)
              }}
            </template></el-table-column
          >
          <el-table-column prop="FinanceDate" label="到账日期" width="180">
            <template slot-scope="scope">
              {{ formatDate(scope.row.FinanceDate).substr(0, 10) }}
            </template>
          </el-table-column>
          <el-table-column
            prop="Note"
            label="备注"
            width="180"
          ></el-table-column>
          <el-table-column
            prop="CreaterName"
            label="操作员"
            width="130"
          ></el-table-column>
        </el-table>
      </el-tab-pane>
      <el-tab-pane label="补贴详情" name="first">
        <el-table
          :data="tableList"
          border
          style="width: 100%"
          :header-cell-style="{ 'text-align': 'center' }"
          :cell-style="{ 'text-align': 'center' }"
          :row-style="{ height: '45px', padding: '0' }"
        >
          <el-table-column
            prop="LandExpropriatedAge"
            label="被征地时年龄（周岁）"
            width="170"
          >
          </el-table-column>
          <el-table-column
            prop="BasicSubsidyYears"
            label="基准补贴年限"
            width="150"
          >
            <template slot-scope="scope">
              {{
                scope.row.BasicSubsidyYears == ""
                  ? "-"
                  : yearjs(scope.row.BasicSubsidyYears)
              }}
            </template>
          </el-table-column>
          <el-table-column
            prop="PovertySubsidyYears"
            label="享受困难补贴年限"
            width="170"
          >
            <template slot-scope="scope">
              {{
                scope.row.PovertySubsidyYears == 0
                  ? "-"
                  : yearjs(scope.row.PovertySubsidyYears)
              }}
            </template>
          </el-table-column>
          <el-table-column
            prop="CompanyPaymentYears"
            label="职工养老缴费年限"
            width="170"
          >
            <template slot-scope="scope">
              {{
                scope.row.CompanyPaymentYears == 0
                  ? "-"
                  : yearjs(scope.row.CompanyPaymentYears)
              }}
            </template>
          </el-table-column>
          <el-table-column
            prop="FinalSubsidyYears"
            label="享受补贴年限"
            width="170"
          >
            <template slot-scope="scope">
              {{ yearjs(scope.row.FinalSubsidyYears) }}
            </template>
          </el-table-column>
          <el-table-column prop="SubsidyMoney" label="补贴金额" width="150">
            <template slot-scope="scope">
              {{ number_format(scope.row.SubsidyMoney, 2) }}
            </template>
          </el-table-column>
        </el-table>
      </el-tab-pane>
      <el-tab-pane label="项目详情" name="third">
        <el-table
          :data="tableD"
          border
          style="width: 100%"
          :header-cell-style="{ 'text-align': 'center' }"
          :cell-style="{
            'text-align': 'center',
            height: '40px',
            'line-height': '40px',
          }"
          :header-row-style="{
            height: '20px',
            'line-height': '0px',
            padding: '0',
          }"
          :row-style="{ height: '45px', 'line-height': '40px' }"
        >
          <el-table-column prop="ProjectName" label="项目名称" width="180">
          </el-table-column>
          <el-table-column prop="Township" label="乡镇" width="180">
          </el-table-column>
          <el-table-column prop="Village" label="村"></el-table-column>
          <el-table-column prop="YearNum" label="年度"></el-table-column>
          <el-table-column prop="BatchNum" label="批次"></el-table-column>
          <el-table-column prop="BlockNum" label="地块"></el-table-column>
          <el-table-column prop="ApprovedDate" label="基准日期" width="160">
            <template slot-scope="scope">{{
              scope.row.ApprovedDate == ""
                ? "-"
                : formatDate(scope.row.ApprovedDate).substr(0, 10)
            }}</template>
          </el-table-column>
          <el-table-column prop="InterestDate" label="计息日期" width="160">
            <template slot-scope="scope">{{
              formatDate(scope.row.InterestDate).substr(0, 10)
            }}</template>
          </el-table-column>
          <el-table-column
            prop="Avgsocialwageyear"
            label="社平工资年度"
            width="150"
          >
            <template slot-scope="scope">
              {{
                scope.row.Avgsocialwageyear == 0
                  ? "-"
                  : scope.row.Avgsocialwageyear
              }}
            </template>
          </el-table-column>
          <el-table-column
            prop="Avgsocialwage"
            label="社平工资金额"
            width="150"
          >
            <template slot-scope="scope">
              {{
                scope.row.Avgsocialwage == 0
                  ? "-"
                  : number_format(scope.row.Avgsocialwage)
              }}
            </template>
          </el-table-column>
          <el-table-column
            prop="ApprovedArea"
            label="用地面积（亩）"
            width="150"
          ></el-table-column>
          <el-table-column prop="RegionPrice" label="区片价"></el-table-column>
          <el-table-column prop="LevyScale" label="征缴比例">
            <template slot-scope="scope">
              {{ (scope.row.LevyScale * 100).toFixed(2) + "%" }}
            </template></el-table-column
          >
          <el-table-column prop="SecurityAmount" label="社会保险费" width="150">
            <template slot-scope="scope">
              {{ number_format(scope.row.SecurityAmount, 2) }}
            </template>
          </el-table-column>
          <el-table-column
            prop="HouseholdCount"
            label="征地户数"
          ></el-table-column>
          <el-table-column
            prop="FarmerCount"
            label="征地人数"
          ></el-table-column>
        </el-table>
      </el-tab-pane>
    </el-tabs>
    <!-- 需要打印的表单 -->
    <div class="row" id="printTest" style="visibility: hidden">
      <div id="div1">
        <div class="title" style="text-align: center">
          <h3
            id="PageTitle"
            class="text-center"
            style="border-collapse: collapse; margin-left: 0pt"
            v-if="gridData.SocialSecurityType == 0"
          >
            被征地农民参保补贴账户支出登记表{{ "(" + "其他" + ")" }}
          </h3>
          <h3
            id="PageTitle"
            class="text-center"
            style="border-collapse: collapse; margin-left: 0pt"
            v-else-if="gridData.SocialSecurityType == 1"
          >
            被征地农民参保补贴账户支出登记表{{ "(" + "城居保" + ")" }}
          </h3>
          <h3
            id="PageTitle"
            class="text-center"
            style="border-collapse: collapse; margin-left: 0pt"
            v-else
          >
            被征地农民参保补贴账户支出登记表{{ "(" + "职保" + ")" }}
          </h3>
        </div>
        <table width="100%">
          <tr>
            <td style="border: none; font-size: 8pt">
              <p>
                <span id="ProjectName">{{
                  gridData.Township +
                  "-" +
                  gridData.Village +
                  "-" +
                  gridData.ProjectName
                }}</span>
              </p>
            </td>
            <td style="text-align: left; border: none; font-size: 8pt">
              <p><span id="ProjectName"></span></p>
            </td>
            <td colspan="2"></td>
            <td></td>
            <td style="text-align: right; font-size: 8pt">
              <!-- <span tdata="pageNO" format="#">第#页</span>/<span
                tdata="pageCount"
                format="#"
                >总##页</span
              > -->
              <p>
                <span>登记日期:</span
                ><span id="ProjectName">{{ timeout(new Date()) }}</span>
              </p>
            </td>
          </tr>
        </table>
      </div>
      <div id="div2">
        <table style="border: 1px solid" width="100%">
          <tr>
            <td style="text-align: center; width: 16.5%" colspan="3">
              <p>
                <span>姓名</span>
              </p>
            </td>
            <td style="text-align: center; width: 16.5%" colspan="3">
              <p>
                <span id="township">{{ gridData.Name }}</span>
              </p>
            </td>
            <td style="text-align: center; width: 16.5%" colspan="3">
              <p>
                <span>性别</span>
              </p>
            </td>
            <td style="text-align: center; width: 16.5%" colspan="3">
              <p>
                <span id="Village">{{
                  gridData.GenderCode == 1 ? "男" : "女"
                }}</span>
              </p>
            </td>
          </tr>
          <tr>
            <td style="text-align: center" colspan="3">
              <p>
                <span>身份证号</span>
              </p>
            </td>
            <td style="text-align: center" colspan="3">
              <p>
                <span id="YearNum">{{ gridData.IdentityNum }}</span>
              </p>
            </td>
            <td style="text-align: center" colspan="3">
              <p>
                <span>联系电话</span>
              </p>
            </td>
            <td style="text-align: center" colspan="3">
              <p>
                <span id="BatchNum">{{ phonenum }}</span>
              </p>
            </td>
          </tr>
          <tr>
            <td style="text-align: center" colspan="3">
              <p><span>开户银行</span></p>
            </td>
            <td style="text-align: center" colspan="3">
              <p>
                <span id="HouseholdCount">{{ inputLines }} </span>
              </p>
            </td>
            <td style="text-align: center" colspan="3">
              <p><span>银行账号</span></p>
            </td>
            <td style="text-align: center" colspan="3">
              <p>
                <span id="LevyScale">{{ inputNumber }}</span>
              </p>
            </td>
          </tr>
          <tr>
            <td style="text-align: center" colspan="3">
              <p><span>账户余额</span></p>
            </td>
            <td style="text-align: center" colspan="3">
              <p>
                <span id="FarmerCount"
                  >{{
                    gridData.Balance == ""
                      ? "0"
                      : number_format(gridData.Balance, 2)
                  }}元</span
                >
              </p>
            </td>
            <td style="text-align: right" colspan="3">
              <p><span>支出金额</span></p>
            </td>
            <td colspan="3" style="text-align: center">
              <p>
                <span style="text-align: right" id="SecurityAmount"
                  >{{ number_format(inputMoney, 2) }}元
                </span>
              </p>
            </td>
          </tr>
          <tr>
            <td style="text-align: center" colspan="3">
              <p><span>支出金额（大写）</span></p>
            </td>
            <td style="text-align: left" colspan="9">
              {{ this.$moneyBig.required(this.inputMoney) }}
            </td>
          </tr>
          <tr>
            <td
              style="
                text-align: left;
                width: 20%;
                height: 50px;
                line-height: 25px;
              "
              colspan="2"
            >
              <div style="margin-top: -20px">申请人：</div>
            </td>
            <td style="text-align: left; width: 20%; height: 50px" colspan="2">
              <div style="margin-top: -17px">经办人：</div>
            </td>
            <td
              style="
                text-align: left;
                width: 20%;
                height: 50px;
                line-height: 25px;
              "
              colspan="2"
            >
              <div style="margin-top: -20px">审核人：</div>
            </td>
            <td
              style="
                text-align: left;
                width: 20%;
                height: 50px;
                line-height: 25px;
              "
              colspan="3"
            >
              <div style="margin-top: -20px">领导签字：</div>
            </td>
            <td
              style="
                text-align: left;
                width: 20%;
                height: 50px;
                line-height: 25px;
              "
              colspan="3"
            >
              <div style="margin-top: -20px">领取人签字：</div>
            </td>
          </tr>
          <!-- <tr>
            <td colspan="6">{{'制表人：' + user_zd}}</td>
            <td colspan="6">{{'制表时间：'+ dateToString(new Date())}}</td>
          </tr> -->
        </table>
      </div>
      <div id="div4">
        <table style="border: 0px solid" width="100%">
          <tr>
            <td style="text-align: left; font-size: 8pt">
              制表人：{{ user_zd }}
            </td>
            <td></td>
            <td style="text-align: left; font-size: 8pt">
              制表时间:{{ dateToString(new Date()) }}
            </td>
            <td></td>
          </tr>
        </table>
      </div>
    </div>
    <div class="row" id="printTest" style="visibility: hidden">
      <div id="div5">
        <div class="title" style="text-align: center">
          <h3
            id="PageTitle"
            class="text-center"
            style="border-collapse: collapse; margin-left: 0pt"
            v-if="gridData.SocialSecurityType == 0"
          >
            被征地农民参保补贴账户结算登记表{{ "（" + "其他" + "）" }}
          </h3>
          <h3
            id="PageTitle"
            class="text-center"
            style="border-collapse: collapse; margin-left: 0pt"
            v-else-if="gridData.SocialSecurityType == 1"
          >
            被征地农民参保补贴账户结算登记表{{ "（" + "城居保" + "）" }}
          </h3>
          <h3
            id="PageTitle"
            class="text-center"
            style="border-collapse: collapse; margin-left: 0pt"
            v-else
          >
            被征地农民参保补贴账户结算登记表{{ "（" + "职保" + "）" }}
          </h3>
        </div>
        <table width="100%">
          <tr>
            <td style="border: none; font-size: 8pt">
              <p>
                <span id="ProjectName">{{
                  gridData.Township +
                  "-" +
                  gridData.Village +
                  "-" +
                  gridData.ProjectName
                }}</span>
              </p>
            </td>
            <td style="text-align: left; border: none; font-size: 8pt">
              <p><span id="ProjectName"></span></p>
            </td>
            <td colspan="2"></td>
            <td></td>
            <td style="text-align: right; font-size: 8pt">
              <!-- <span tdata="pageNO" format="#">第#页</span>/<span
                tdata="pageCount"
                format="#"
                >总##页</span
              > -->
              <p>
                <span>登记时间:</span
                ><span id="ProjectName">{{ timeout(new Date()) }}</span>
              </p>
            </td>
          </tr>
        </table>
      </div>
      <div id="div6" ref="aaa">
        <table style="border: 1px solid" width="100%">
          <tr>
            <td style="text-align: center; width: 16.5%" colspan="4">
              <p>
                <span>姓名</span>
              </p>
            </td>
            <td style="text-align: center; width: 16.5%" colspan="6">
              <p>
                <span id="township">{{ gridData.Name }}</span>
              </p>
            </td>
            <td style="text-align: center; width: 16.5%" colspan="4">
              <p>
                <span>性别</span>
              </p>
            </td>
            <td style="text-align: center; width: 16.5%" colspan="6">
              <p>
                <span id="Village">{{
                  gridData.GenderCode == ""
                    ? ""
                    : gridData.GenderCode == 1
                    ? "男"
                    : "女"
                }}</span>
              </p>
            </td>
          </tr>
          <tr>
            <td style="text-align: center" colspan="4">
              <p>
                <span>身份证号</span>
              </p>
            </td>
            <td style="text-align: center" colspan="6">
              <p>
                <span id="YearNum">{{ gridData.IdentityNum }}</span>
              </p>
            </td>
            <td style="text-align: center" colspan="4">
              <p>
                <span>联系电话</span>
              </p>
            </td>
            <td style="text-align: center" colspan="6">
              <p>
                <span id="BatchNum">{{ phonenum }}</span>
              </p>
            </td>
          </tr>
          <tr>
            <td style="text-align: center" colspan="4">
              <p><span>开户银行</span></p>
            </td>
            <td style="text-align: center" colspan="6">
              <p>
                <span id="HouseholdCount">{{ inputLines }} </span>
              </p>
            </td>
            <td style="text-align: center" colspan="4">
              <p><span>银行账号</span></p>
            </td>
            <td style="text-align: center" colspan="6">
              <p>
                <span id="LevyScale">{{ inputNumber }}</span>
              </p>
            </td>
          </tr>
          <tr>
            <td colspan="4" style="height: 108px; text-align: center">
              结算申请原因
            </td>
            <td colspan="16" style="height: 108px">
              <div>
                <input
                  type="checkbox"
                  v-model="one"
                  name="被征地农民出国定居"
                  id=""
                  value="1"
                  ref="one"
                />被征地农民出国定居
              </div>
              <div>
                <input
                  type="checkbox"
                  v-model="two"
                  name="被征地农民死亡"
                  id=""
                  value="2"
                  ref="two"
                />被征地农民死亡
              </div>
              <div>
                <input
                  type="checkbox"
                  v-model="thr"
                  name="被征地农民达到待遇领取条件"
                  id=""
                  value="3"
                  ref="thr"
                />被征地农民达到待遇领取条件
              </div>
              <div>
                <input
                  type="checkbox"
                  v-model="fou"
                  name="以灵活就业人员参保并享受待遇"
                  id=""
                  value="4"
                  ref="fou"
                />以灵活就业人员参保并享受待遇
              </div>
              <div>
                <input
                  type="checkbox"
                  v-model="fiv"
                  name="其他："
                  id=""
                  value="5"
                  ref="fiv"
                />其他：{{ wriwo }}
              </div>
            </td>
          </tr>
          <tr>
            <td style="text-align: center; width: 25%" colspan="4">
              <p><span>账户余额</span></p>
            </td>
            <td style="text-align: center; width: 25%" colspan="6">
              <p>
                <span id="FarmerCount"
                  >{{
                    gridData.Balance == ""
                      ? "0"
                      : number_format(gridData.Balance, 2)
                  }}元</span
                >
              </p>
            </td>
            <td style="text-align: center; width: 25%" colspan="4">
              <p><span>本年度计息</span></p>
            </td>
            <td colspan="6" style="text-align: center; width: 25%">
              <p>
                <span style="text-align: right" id="SecurityAmount"
                  >{{ gridData.InterestMoney }}元
                </span>
              </p>
            </td>
          </tr>
          <tr>
            <td style="text-align: center" colspan="4">
              <p><span>结算金额</span></p>
            </td>
            <td style="text-align: center" colspan="16">
              <p>
                <span id="FarmerCount">{{
                  number_format(inputMoney, 2) + "元"
                }}</span>
              </p>
            </td>
          </tr>
          <tr>
            <td style="text-align: center" colspan="4">
              <p><span>结算金额（大写）</span></p>
            </td>
            <td style="text-align: left" colspan="16">
              {{ this.$moneyBig.required(this.inputMoney) }}
            </td>
          </tr>
          <tr>
            <td
              style="
                text-align: center;
                width: 33%;
                height: 50px;
                line-height: 20px;
              "
              colspan="4"
              rowspan="4"
            >
              <p><span>领取人</span></p>
            </td>

            <td style="text-align: center" colspan="4" rowspan="1">
              <p><span> 与参保人关系</span></p>
            </td>
            <td style="text-align: center" colspan="4" rowspan="1">
              <div v-if="this.radio3 == 1">本人</div>
              <div v-else>
                <p v-if="this.radio5 == 1">配偶</p>
                <p v-if="this.radio5 == 2">子女</p>
                <p v-if="this.radio5 == 3">父母</p>
                <p v-if="this.radio5 == 4">兄弟姐妹</p>
                <p v-if="this.radio5 == 5">祖父母</p>
                <p v-if="this.radio5 == 6">外祖父母</p>
                <p v-if="this.radio5 == 7">{{ qt }}</p>
              </div>
            </td>
            <td style="text-align: center" colspan="4" rowspan="1">
              <p><span></span></p>
            </td>
            <td style="text-align: center" colspan="4" rowspan="1">
              <p><span></span></p>
            </td>
          </tr>
          <tr>
            <td
              style="text-align: center; width: 100px"
              colspan="4"
              rowspan="1"
            >
              <p><span>身份证号</span></p>
            </td>
            <td style="text-align: center" colspan="4" rowspan="1">
              <p>
                <span>{{
                  radio3 == 2 ? typeInfo.idcard : gridData.IdentityNum
                }}</span>
              </p>
            </td>
            <td style="text-align: center" colspan="4" rowspan="1">
              <p><span>联系电话</span></p>
            </td>
            <td style="text-align: center" colspan="4" rowspan="1">
              <p>
                <span>{{ radio3 == 2 ? typeInfo.phonenum : phonenum }}</span>
              </p>
            </td>
          </tr>
          <tr>
            <td style="text-align: center" colspan="4" rowspan="1">
              <p><span>姓名</span></p>
            </td>
            <td style="text-align: center" colspan="4" rowspan="1">
              <p>
                <span>{{ radio3 == 2 ? typeInfo.name : gridData.Name }}</span>
              </p>
            </td>
            <td style="text-align: center" colspan="4" rowspan="1">
              <p><span>性别</span></p>
            </td>
            <td style="text-align: center" colspan="4" rowspan="1">
              <div v-if="this.radio3 == 1">
                {{ gridData.GenderCode == 1 ? "男" : "女" }}
              </div>
              <div v-else>
                <p v-if="this.radio4 == 1"><span>男</span></p>
                <p v-if="this.radio4 == 2"><span>女</span></p>
              </div>
              <!-- <p><span>{{radio4 == 1 ?'男' : '女'}}</span></p> -->
            </td>
          </tr>
          <tr>
            <td style="text-align: center" colspan="4" rowspan="1">
              <p><span>开户银行</span></p>
            </td>
            <td style="text-align: center" colspan="4" rowspan="1">
              <p>
                <span>{{ radio3 == 2 ? typeInfo.bank : inputLines }}</span>
              </p>
            </td>
            <td style="text-align: center" colspan="4" rowspan="1">
              <p><span>银行账号</span></p>
            </td>
            <td style="text-align: center" colspan="4" rowspan="1">
              <p>
                <span>{{ radio3 == 2 ? typeInfo.banknum : inputNumber }}</span>
              </p>
            </td>
          </tr>
          <tr>
            <td
              style="
                text-align: left;
                width: 20%;
                height: 50px;
                line-height: 25px;
              "
              colspan="4"
            >
              <div style="margin-top: -20px">申请人：</div>
            </td>
            <td style="text-align: left; width: 20%; height: 50px" colspan="4">
              <div style="margin-top: -17px">经办人：</div>
            </td>
            <td
              style="
                text-align: left;
                width: 20%;
                height: 50px;
                line-height: 25px;
              "
              colspan="4"
            >
              <div style="margin-top: -20px">审核人：</div>
            </td>
            <td
              style="
                text-align: left;
                width: 20%;
                height: 50px;
                line-height: 25px;
              "
              colspan="4"
            >
              <div style="margin-top: -20px">领导签字：</div>
            </td>
            <td
              style="
                text-align: left;
                width: 20%;
                height: 50px;
                line-height: 25px;
              "
              colspan="4"
            >
              <div style="margin-top: -20px">领取人签字：</div>
            </td>
          </tr>
          <!-- <tr>
            <td colspan="6">{{'制表人：' + user_zd}}</td>
            <td colspan="6">{{'制表时间：'+ dateToString(new Date())}}</td>
          </tr> -->
        </table>
      </div>
      <div id="div7">
        <table style="border: 0px solid" width="100%">
          <tr>
            <td style="text-align: left; font-size: 8pt">
              制表人：{{ user_zd }}
            </td>
            <td></td>
            <td style="text-align: left; font-size: 8pt">
              制表时间:{{ dateToString(new Date()) }}
            </td>
            <td></td>
          </tr>
        </table>
      </div>
    </div>
  </div>
</template>
<script>
import {
  API_GET_LAND,
  API_AREA_TOWNSHIP,
  API_AREA_VILLAGE,
  API_GET_LIST_L,
} from "../../api/table";
import {
  API_GET_LIST,
  API_GET_INFO,
  API_ZHICHU_DZ,
  API_ZHICHU_NO,
  API_CHANGE_INSURE,
} from "../../api/account";
import { API_GET_LIXI, API_GET_DEJI } from "../../api/settlement";
import { getLodop } from "@/assets/utils/LodopFuncs";
import { API_NEW_ONE,API_TSH_LIST } from "../../api/adjustment";
export default {
  name: "",
  data() {
    return {
      msg: "账户信息管理（城居保）",
      pagesize: 10, //每页的数据条数
      currentPage: 1,
      formInline: {
        user: "",
        region: [],
        /* 乡镇村数据模拟模型 */
        options: [],
        Allvillage: [],
        village: "",
        year: "",
        years: [],
        projectname: "",
        name: "",
      },
      state: 1, // 状态
      states: [
        {
          value: 1,
          label: "正常",
        },
        {
          value: 0,
          label: "初始化",
        },
        {
          value: 5,
          label: "已结算",
        },
      ],
      // 参保类型转换
      showInsure: false,
      newInsure: "请选择",
      newInsures: [
        {
          value: 0,
          label: "其他",
        },
        {
          value: 1,
          label: "城居保",
        },
        {
          value: 2,
          label: "职保",
        },
      ], //
      tableData: [],
      tableList: [],
      tableInfo: [],
      tableD: [],
      project: false, // 征地项目详情显示隐藏
      projectNJS: false, // 结算详情显示隐藏
      projectqqq: false,
      flowing: false, // 账户流水详情显示隐藏
      gridData: {
        Name: "",
      }, // 支出登记征地项目数据
      textarea: "",
      gridInfo: [], // 账户流水详情数据
      title: "",
      table: false,
      labelPosition: "right", // 征地项目详情输入框文字右对齐
      labelPosition1: "left",
      options: [],
      activeName: "second",
      radio: null,
      currentRow: null,
      input: "",
      inputMoney: "",
      inputLines: "",
      inputNumber: "",
      phonenum: "",
      // inputMoneyBig:"",
      user_zd: "",
      radio2: "",
      radio3: 1,
      radio4: "",
      radio5: "",
      benren: true,
      typeInfo: {
        ship: "",
        name: "",
        idcard: "",
        phonenum: "",
        address: "",
        dres: "",
        bank: "",
        banknum: "",
      },
      checkList: [],
      one: true,
      two: null,
      thr: null,
      fou: null,
      fiv: null,
      checked: true,
      isdisable: false,
      showqt: true,
      showgx: true,
      wriwo: "",
      qt: "",
      insure: false,
    };
  },
  methods: {
    changeTypeR() {
      this.radio = null;
    },
    // 参保类型转换
    changeType(row) {
      this.insure = true;
      this.gridData = row;
      if (this.gridData.SocialSecurityType == 0) {
        this.newInsures = [
          {
            value: 1,
            label: "城居保",
          },
          {
            value: 2,
            label: "职保",
          },
        ];
      } else if (this.gridData.SocialSecurityType === 1) {
        this.newInsures = [
          {
            value: 0,
            label: "其他",
          },
          {
            value: 2,
            label: "职保",
          },
        ];
      } else if (this.gridData.SocialSecurityType == 2) {
        this.newInsures = [
          {
            value: 0,
            label: "其他",
          },
          {
            value: 1,
            label: "城居保",
          },
        ];
      }
    },
    // 新参保类型选择
    insureChange() {
      if (this.newInsure == 1) {
        console.log("城居保");
        let data = {
          AccountId: this.gridData.Accountid,
        };
        API_GET_LIXI(data)
          .then((res) => {
            console.log(res);
            // this.gridData.InterestMoney = this.number_format(
            //   res.ResList.RateMoney,
            //   2
            // );
            this.gridData.InterestMoney =res.ResList.RateMoney;
            this.inputMoney = res.ResList.FinanceMoney;
          })
          .catch((err) => {
            console.log(err);
          });
        this.showInsure = true;
      } else {
        console.log("职保&其他");
        this.inputMoney = "";
        this.gridData.InterestMoney = "";
        this.showInsure = false;
      }
    },
    changeInsure() {
      let data = {
        Farmerid: this.gridData.Id,
        Oldsocialsecuritytype: this.gridData.SocialSecurityType,
        Newsocialsecuritytype: this.newInsure,
        // AddMoney:0,
        FinishMoney: this.inputMoney,
        BalanceMoney: this.gridData.Balance,
        InterestMoney: this.gridData.InterestMoney,
        RegisterDate: this.dateToString(new Date()),
        Name: this.gridData.Name,
        Township: this.gridData.Township,
        Village: this.gridData.Village,
        ProjectName: this.gridData.ProjectName,
        IdentityNum: this.gridData.IdentityNum,
      };
      if (this.newInsure != "请选择") {
        API_NEW_ONE(data)
          .then((res) => {
            console.log(res);
            this.$message.success("修改成功！");
            this.onSubmit();
            this.insure = false;
            this.clear();
            this.clearInfo();
          })
          .catch((err) => {
            console.log(err);
            this.clear();
            this.clearInfo();
          });
      } else {
        this.$message.warning("未选择新参保类型！");
        this.clear();
        this.clearInfo();
      }
    },
    clsTabList() {
      this.tableList = [];
      this.tableInfo = [];
      this.tableD = [];
    },
    clearInfo() {
      this.inputMoney = "";
      this.inputLines = "";
      this.phonenum = "";
      this.inputNumber = "";
      this.textarea = "";
      this.radio3 = 1;
      this.radio4 = "";
      this.radio2 = "";
      this.radio5 = "";
      this.benren = true;
      this.projectNJS = false;
      this.project = false;
      this.benren = true;
      this.typeInfo.ship = "";
      this.typeInfo.name = "";
      this.typeInfo.idcard = "";
      this.typeInfo.phonenum = "";
      this.typeInfo.address = "";
      this.typeInfo.dres = "";
      this.typeInfo.bank = "";
      this.typeInfo.banknum = "";
      this.qt = "";
      this.showgx = true;
      this.wriwo = "";
      this.insure = false;
      this.projectqqq = false;
      this.newInsure = "请选择";
      this.showInsure = false;
      
    },
    // 清除已选条件
    clear() {
      this.formInline.region = "";
      this.formInline.village = "";
      this.formInline.projectname = "";
      this.formInline.name = "";
      this.newInsure = "请选择";
      this.submitProjectName();
      this.showInsure = false;
    },

    // 月转化为年显示
    yearjs(num) {
      if ((num % 12 != 0) & (num > 12)) {
        return parseInt(num / 12) + "年" + (num % 12) + "月";
      } else if (num < 12) {
        return num + "月";
      } else {
        return parseInt(num / 12);
      }
    },
    handleCurrent(currentRow, oldCurrentRow, val) {
      console.log(currentRow); // 新选中的数据
      this.tableList = [];
      this.tableInfo = [];
      this.tableD = [];
      this.tableList.push(currentRow);
      this.tableD.push(currentRow);
      this.currentRow = val;
      let data = { id: currentRow.Accountid };
      API_GET_INFO(data)
        .then((res) => {
          console.log(res);
          this.tableInfo = res.ResList;
        })
        .catch((err) => {
          console.log(err);
        });
    },
    handleCurrentqqq(row) {
      let data = { id: row.Accountid };
      API_GET_INFO(data)
        .then((res) => {
          console.log(res);
          this.tableInfo = res.ResList;
          this.projectqqq = true;
        })
        .catch((err) => {
          console.log(err);
        });
    },
    radChange() {
      if (this.radio == 3) {
        this.onSubmit();
        // console.log("查询");
      } else if (this.radio == 0) {
        this.onSubmit0();
      } else if (this.radio == 1) {
        this.onSubmit1();
      } else if (this.radio == 2) {
        this.onSubmit2();
      }
    },
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`);
      this.pagesize = val;
    },
    handleCurrentChange(currentPage) {
      this.currentPage = currentPage;
      this.clsTabList();
      console.log(`第${currentPage}页`);
    },
    handleClick(tab, event) {
      // console.log(tab, event);
    },
    onSubmit() {
      // this.isdisable = true;
      let data = {
        // township,
        // Village,
        // ProjectName,
        // para: this.formInline.name,
        // landid: this.formInline.projectname,
        // SocialSecurityType: this.radio, // 社保类型
        status: this.state,
      };
      if (this.formInline.region != "") {
        data.township = this.formInline.region.Id;
      }
      if (this.formInline.village != "") {
        data.Village = this.formInline.village.Id;
      }
      if (this.formInline.projectname != "") {
        // console.log(this.formInline.projectname);
        data.landid = this.formInline.projectname.Id;
      }
      if (this.formInline.name != "") {
        data.para = this.formInline.name;
      }
      if (this.radio != 3) {
        SocialSecurityType = this.radio;
      }
      API_GET_LIST(data)
        .then((res) => {
          console.log(res);
          this.tableData = res.ResList;
          this.$message.success("查询成功！");
        })
        .catch((err) => {
          console.log(err);
        });
    },
    // 其他
    onSubmit0() {
      let data = {
        // township,
        // Village,
        // ProjectName,
        // para: this.formInline.name,
        // landid: this.formInline.projectname,
        SocialSecurityType: 0, // 社保类型
        status: this.state,
      };
      if (this.formInline.region != "") {
        data.township = this.formInline.region.Id;
      }
      if (this.formInline.village != "") {
        data.Village = this.formInline.village.Id;
      }
      if (this.formInline.projectname != "") {
        // console.log(this.formInline.projectname);
        data.landid = this.formInline.projectname.Id;
      }
      if (this.formInline.name != "") {
        data.para = this.formInline.name;
      }
      API_GET_LIST(data)
        .then((res) => {
          console.log(res);
          this.tableData = res.ResList;
          this.$message.success("查询成功！");
        })
        .catch((err) => {
          console.log(err);
        });
    },
    // 城居保
    onSubmit1() {
      let data = {
        // township,
        // Village,
        // ProjectName,
        // para: this.formInline.name,
        // landid: this.formInline.projectname,
        SocialSecurityType: 1, // 社保类型
        status: this.state,
      };
      if (this.formInline.region != "") {
        data.township = this.formInline.region.Id;
      }
      if (this.formInline.village != "") {
        data.Village = this.formInline.village.Id;
      }
      if (this.formInline.projectname != "") {
        // console.log(this.formInline.projectname);
        data.landid = this.formInline.projectname.Id;
      }
      if (this.formInline.name != "") {
        data.para = this.formInline.name;
      }
      API_GET_LIST(data)
        .then((res) => {
          console.log(res);
          this.tableData = res.ResList;
          this.$message.success("查询成功！");
        })
        .catch((err) => {
          console.log(err);
        });
    },
    // 职保
    onSubmit2() {
      let data = {
        // township,
        // Village,
        // ProjectName,
        // para: this.formInline.name,
        // landid: this.formInline.projectname,
        SocialSecurityType: 2, // 社保类型
        status: this.state,
      };
      if (this.formInline.region != "") {
        data.township = this.formInline.region.Id;
      }
      if (this.formInline.village != "") {
        data.Village = this.formInline.village.Id;
      }
      if (this.formInline.projectname != "") {
        // console.log(this.formInline.projectname);
        data.landid = this.formInline.projectname.Id;
      }
      if (this.formInline.name != "") {
        data.para = this.formInline.name;
      }
      API_GET_LIST(data)
        .then((res) => {
          console.log(res);
          this.tableData = res.ResList;
          this.$message.success("查询成功！");
        })
        .catch((err) => {
          console.log(err);
        });
    },
    handleChange(value) {
      console.log(value);
    },
    handleproject(row) {
      this.project = true;
      this.gridData = row;
      this.phonenum = this.gridData.PhoneNum;
      this.inputLines = this.gridData.BankName;
      this.inputNumber = this.gridData.BankAccount;
    },
    // 金额格式化
    number_format(number, decimals, dec_point, thousands_sep) {
      /*
       * 参数说明：
       * number：要格式化的数字
       * decimals：保留几位小数
       * dec_point：小数点符号
       * thousands_sep：千分位符号
       *
       */
      number = (number + "").replace(/[^0-9+-Ee.]/g, "");
      var n = !isFinite(+number) ? 0 : +number,
        prec = !isFinite(+decimals) ? 0 : Math.abs(decimals),
        sep = typeof thousands_sep === "undefined" ? "," : thousands_sep,
        dec = typeof dec_point === "undefined" ? "." : dec_point,
        s = "",
        toFixedFix = function (n, prec) {
          var k = Math.pow(10, prec);
          return "" + parseInt(n * k) / k;
        };
      s = (prec ? toFixedFix(n, prec) : "" + parseInt(n)).split(".");
      var re = /(-?\d+)(\d{3})/;
      while (re.test(s[0])) {
        s[0] = s[0].replace(re, "$1" + sep + "$2");
      }
      if ((s[1] || "").length < prec) {
        s[1] = s[1] || "";
        s[1] += new Array(prec - s[1].length + 1).join("0");
      }
      return s.join(dec);
    },
    // 时间戳格式化
    dateToString(date) {
      var y = date.getFullYear();
      var m = date.getMonth() + 1;
      m = m < 10 ? "0" + m : m;
      var d = date.getDate();
      d = d < 10 ? "0" + d : d;
      var h = date.getHours();
      h = h < 10 ? "0" + h : h;
      var minute = date.getMinutes();
      minute = minute < 10 ? "0" + minute : minute;
      var second = date.getSeconds();
      second = second < 10 ? "0" + second : second;
      return y + "-" + m + "-" + d + " " + h + ":" + minute + ":" + second;
    },
    timeout(date) {
      var y = date.getFullYear();
      var m = date.getMonth() + 1;
      m = m < 10 ? "0" + m : m;
      var d = date.getDate();
      d = d < 10 ? "0" + d : d;
      return y + "年" + m + "月" + d + "日";
    },
    timeover(date) {
      var y = date.getFullYear();
      var m = date.getMonth() + 1;
      m = m < 10 ? "0" + m : m;
      var d = date.getDate();
      d = d < 10 ? "0" + d : d;
      return y + "-" + m + "-" + d;
    },
    handleflowing(row) {
      this.gridData = row;
      let data = {
        AccountId: row.Accountid,
        // rate: row.rate,
        // RateDate: row.RateDate,
      };
      // data.data = this.timeover(new Date());
      console.log(data);
      API_GET_LIXI(data)
        .then((res) => {
          console.log(res);
          // this.gridData.Balance = this.number_format(
          //   res.ResList.BalanceMoney,
          //   2
          // );
          this.gridData.InterestMoney = this.number_format(
            res.ResList.RateMoney,
            2
          );
          this.inputMoney = res.ResList.FinanceMoney;
        })
        .catch((err) => {
          console.log(err);
        })
        .then((_) => {
          console.log(this.gridData.InterestMoney);
          this.table = true;
          this.projectNJS = true;
          this.gridData = row;
          this.phonenum = this.gridData.PhoneNum;
          this.inputLines = this.gridData.BankName;
          this.inputNumber = this.gridData.BankAccount;
        });
    },
    addgsForm() {
      this.project = true;
      this.title = "征地项目详情";
    },
    /* 获取征地项目列表 */
    submitProjectName() {
      API_GET_LAND()
        .then((res) => {
          this.options = res.ResList;
        })
        .catch((err) => {
          console.log(err);
        });
    },
    handleChangeV() {
      this.changeTypeR();
      // this.addsubmitship();
      this.formInline.village = "";
      this.projec();
      API_AREA_VILLAGE()
        .then((res) => {
          this.formInline.Allvillage = [];
          res.ResList.map((item, index) => {
            if (item.TownshipId == this.formInline.region.Id) {
              this.formInline.Allvillage.push(item);
            }
          });
          // console.log(this.formInline.Allvillage);
        })
        .catch((err) => {
          console.log(err);
        });
    },
    // 查询征地项目信息
    projec() {
      this.options = [];
      this.changeTypeR();
      this.formInline.projectname = "";
      let data = {
        // Village: this.formInline.village.Id,
        // township: this.formInline.region.Id,
      };
      if (
        (this.formInline.region.Id != "") &
        (this.formInline.village.Id == undefined)
      ) {
        data.township = this.formInline.region.Id;
      }
      if (this.formInline.village.Id != undefined) {
        data.Village = this.formInline.village.Id;
        data.township = 0;
      }
      console.log(this.formInline.village.Id);
      console.log(this.formInline.region.Id);
      API_GET_LIST_L(data)
        .then((res) => {
          console.log(res);
          this.options = res.ResList;
        })
        .catch((err) => {
          console.log(err);
        });
    },
    // 获取乡镇数据
    submitvill() {
      API_AREA_TOWNSHIP()
        .then((res) => {
          this.formInline.options = res.ResList;
        })
        .catch((err) => {
          console.log(err);
        });
    },
    // 获取村数据
    addsubmitship() {
      API_AREA_VILLAGE()
        .then((res) => {
          this.formInline.Allvillage = [];
          res.ResList.map((item, index) => {
            if (item.TownshipId == this.formInline.region.Id) {
              this.formInline.Allvillage.push(item);
            }
          });
          console.log(this.formInline.Allvillage);
        })
        .catch((err) => {
          console.log(err);
        });
    },
    formatDate(time) {
      if (time != "") {
        if (time.toString().substr(6, 13) < 0) {
          return "";
        } else {
          return this.timeD(new Date(parseInt(time.toString().substr(6, 13))));
        }
      }
    },
    timeD(date) {
      var y = date.getFullYear();
      var m = date.getMonth() + 1;
      m = m < 10 ? "0" + m : m;
      var d = date.getDate();
      d = d < 10 ? "0" + d : d;
      var h = date.getHours();
      h = h < 10 ? "0" + h : h;
      var minute = date.getMinutes();
      minute = minute < 10 ? "0" + minute : minute;
      var second = date.getSeconds();
      second = second < 10 ? "0" + second : second;
      return y + "-" + m + "-" + d + " " + h + ":" + minute + ":" + second;
    },
    determine() {
      this.isdisable = true;
      let data = {
        Accountid: this.gridData.Accountid,
        OutMoney: this.inputMoney,
        PhoneNum: this.phonenum,
        Note: this.textarea,
        bankname:
          this.gridData.BankName == ""
            ? this.inputLines
            : this.gridData.BankName,
        bankaccount:
          this.gridData.BankAccount == ""
            ? this.inputNumber
            : this.gridData.BankAccount,
      };
      if (this.inputMoney == "") {
        this.$message.warning("未填写支出金额");
        this.isdisable = false;
      } else {
        if (this.inputNumber == "") {
          this.$message.warning("未填写银行账号");
          this.isdisable = false;
        } else {
          if (this.inputLines == "") {
            this.$message.warning("未填写开户银行");
            this.isdisable = false;
          } else {
            if (this.phonenum == "") {
              this.$message.warning("未填写手机号码");
              this.isdisable = false;
            } else {
              if (this.inputMoney > this.gridData.Balance) {
                this.$message.warning("支出金额不能大于余额");
                this.isdisable = false;
              } else {
                API_ZHICHU_NO(data)
                  .then((res) => {
                    console.log(res);
                    // this.onSubmit();
                    LODOP.PRINT_INIT(
                      "被征地农民参保补贴账户支出登记表（职保）"
                    );
                    var strStyle =
                      "<style> table,td,th {border-width: 1px;border-style: solid;border-collapse: collapse}span{  font-size:8pt ;text-align:left;margin-top:5px;margin-left:15px;}td{font-size:8pt ;padding:5px;}</style>";
                    LODOP.ADD_PRINT_HTM(
                      26,
                      "5%",
                      "90%",
                      109,
                      document.getElementById("div1").innerHTML
                    );
                    LODOP.SET_PRINT_STYLEA(0, "ItemType", 1);
                    LODOP.SET_PRINT_STYLEA(0, "LinkedItem", 1);
                    LODOP.ADD_PRINT_TABLE(
                      100,
                      "5%",
                      "RightMargin:1cm",
                      400,
                      strStyle + document.getElementById("div2").innerHTML
                    );
                    LODOP.SET_PRINT_STYLEA(0, "Offset2Top", -100);
                    LODOP.ADD_PRINT_HTM(
                      "73mm",
                      "15mm",
                      "200mm",
                      "2cm",
                      document.getElementById("div4").innerHTML
                    );
                    LODOP.SET_PRINT_STYLEA(0, "ItemType", 1);
                    LODOP.SET_PRINT_STYLEA(0, "LinkedItem", 4);
                    //LODOP.SET_PRINT_STYLEA(0, "VOrient", 1);
                    LODOP.PREVIEW();
                    this.project = false;
                    this.gridData.businessStatus = 3;
                    setTimeout(() => {
                      this.isdisable = false;
                      this.textarea = "";
                      this.inputMoney = "";
                    }, 1000);
                  })
                  .catch((err) => {
                    console.log(err);
                    this.isdisable = false;
                  });
              }
            }
          }
        }
      }
    },
    determineNJS() {
      this.isdisable = true;
      let data = {
        Note: this.textarea,
        Accountid: this.gridData.Accountid,
        RateDate: this.timeover(new Date()),
        FinanceMoney: this.inputMoney,
        BalanceMoney: this.gridData.Balance,
        RateMoney: this.gridData.InterestMoney,
        ReviewResult: 1,
      };
      if (
        this.radio2 == 1 ||
        this.radio2 == 2 ||
        this.radio2 == 3 ||
        this.radio2 == 4 ||
        this.wriwo != ""
      ) {
        if (this.radio2 == 5) {
          data.Reason = this.wriwo;
          data.ReasonType = 5;
        } else {
          if (this.radio2 == 1) {
            data.Reason = "被征地农民出国定居";
            data.ReasonType = 1;
          } else if (this.radio2 == 2) {
            data.Reason = "被征地农民死亡";
            data.ReasonType = 2;
          } else if (this.radio2 == 3) {
            data.Reason = "被征地农民达到待遇领取条件";
            data.ReasonType = 3;
          } else if (this.radio2 == 4) {
            data.Reason = "以灵活就业人员参保并享受待遇";
            data.ReasonType = 4;
          }
        }
        if (this.radio3 == 1) {
          this.radio5 = "";
          console.log("本人");
          data.Receiver = "0";
          console.log(this.phonenum);
          if (this.phonenum == "" || this.phonenum == null) {
            this.$message.warning("电话号码未填写");
            this.isdisable = false;
          } else {
            if (this.inputLines == "") {
              this.$message.warning("开户银行未填写！");
              this.isdisable = false;
            } else {
              if (this.inputNumber == "") {
                this.$message.warning("银行账号未填写！");
                this.isdisable = false;
              } else {
                data.RelationshipType = "0";
                data.Relationship = "本人";
                data.PhoneNum = this.phonenum;
                data.BankName = this.inputLines;
                data.BankAccount = this.inputNumber;
                data.Receiver = this.gridData.Name;
                data.Ridentitynum = this.gridData.IdentityNum;
                data.Rphonenum = this.phonenum;
                data.Rbankname = this.inputLines;
                data.Rbankaccount = this.inputNumber;
                data.Rgendercode = this.gridData.GenderCode;
                API_GET_DEJI(data)
                  .then((res) => {
                    console.log(res);
                    // this.onSubmit();
                    this.gridData.businessStatus = 4;
                    setTimeout((_) => {
                      LODOP.PRINT_INIT(
                        "被征地农民参保补贴账户结算登记表（职保）"
                      );
                      var strStyle =
                        "<style> table,td,th {border-width: 1px;border-style: solid;border-collapse: collapse}span{  font-size:8pt ;text-align:left;}td{font-size:8pt ;padding:5px;}</style>";
                      LODOP.ADD_PRINT_HTM(
                        26,
                        "5%",
                        "90%",
                        109,
                        document.getElementById("div5").innerHTML
                      );
                      LODOP.SET_PRINT_STYLEA(0, "ItemType", 1);
                      LODOP.SET_PRINT_STYLEA(0, "LinkedItem", 1);
                      LODOP.ADD_PRINT_TABLE(
                        100,
                        "5%",
                        "RightMargin:1cm",
                        500,
                        strStyle + document.getElementById("div6").innerHTML
                      );
                      // LODOP.SET_PRINT_STYLEA(0, "Offset2Top", -100);
                      LODOP.ADD_PRINT_HTM(
                        "134mm",
                        "15mm",
                        "100mm",
                        "2cm",
                        document.getElementById("div7").innerHTML
                      );
                      LODOP.SET_PRINT_STYLEA(0, "ItemType", 1);
                      LODOP.SET_PRINT_STYLEA(0, "LinkedItem", 4);
                      LODOP.PREVIEW();
                      setTimeout(() => {
                        this.isdisable = false;
                        this.projectNJS = false;
                        this.clearInfo();
                      }, 1000);
                    });
                  })
                  .catch((err) => {
                    console.log(err);
                    this.clearInfo();
                    this.isdisable = false;
                    //
                  });
              }
            }
          }
        } else if (this.radio3 == 2) {
          console.log("受益人");
          if (this.radio5 == "" || this.radio5 == null) {
            this.$message.warning("参保人关系未填写");
            this.isdisable = false;
          } else {
            data.Relationshiptype = this.radio5;
            if (this.radio5 == 1) {
              data.Relationship = "配偶";
            } else if (this.radio5 == 2) {
              data.Relationship = "子女";
            } else if (this.radio5 == 3) {
              data.Relationship = "父母";
            } else if (this.radio5 == 4) {
              data.Relationship = "兄弟姐妹";
            } else if (this.radio5 == 5) {
              data.Relationship = "祖父母";
            } else if (this.radio5 == 6) {
              data.Relationship = "外祖父母";
            } else if (this.radio5 == 7) {
              if (this.qt == "") {
                //   this.$message({
                //     message: "参保人关系未填写",
                //     type: 'warning',
                //     offset: 85,
                //   });
                this.isdisable = false;
                // data.Relationship = this.radio5;
              } else {
                data.Relationship = this.qt;
              }
            }
            if (this.typeInfo.name == "") {
              console.log(this.typeInfo.name);
              this.$message.warning("领取人姓名未填写！");
              this.isdisable = false;
            } else {
              if (this.typeInfo.idcard == "") {
                this.$message.warning("领取人身份证号未填写！");
                this.isdisable = false;
              } else {
                if (this.radio4 == "") {
                  this.$message.warning("领取人性别未填写！");
                  this.isdisable = false;
                } else {
                  if (this.typeInfo.phonenum == "") {
                    this.$message.warning("领取人电话号码未填写！");
                    this.isdisable = false;
                  } else {
                    if (this.typeInfo.bank == "") {
                      this.$message.warning("领取人开户银行未填写！");
                      this.isdisable = false;
                    } else {
                      if (this.typeInfo.banknum == "") {
                        this.$message.warning("领取人银行账号未填写！");
                        this.isdisable = false;
                      } else {
                        data.PhoneNum = this.phonenum;
                        data.BankName = this.inputLines;
                        data.BankAccount = this.inputNumber;
                        data.Receiver = this.typeInfo.name;
                        data.Ridentitynum = this.typeInfo.idcard;
                        data.Rphonenum = this.typeInfo.phonenum;
                        data.Rbankname = this.typeInfo.bank;
                        data.Rbankaccount = this.typeInfo.banknum;
                        data.Rgendercode = this.radio4;
                        console.log(data);
                        API_GET_DEJI(data)
                          .then((res) => {
                            console.log(res);
                            // this.onSubmit();
                            this.gridData.businessStatus = 4;
                            setTimeout((_) => {
                              LODOP.PRINT_INIT(
                                "被征地农民参保补贴账户结算登记表（职保）"
                              );
                              var strStyle =
                                "<style> table,td,th {border-width: 1px;border-style: solid;border-collapse: collapse}span{  font-size:8pt ;text-align:left;}td{font-size:8pt ;padding:5px;}</style>";
                              LODOP.ADD_PRINT_HTM(
                                26,
                                "5%",
                                "90%",
                                109,
                                document.getElementById("div5").innerHTML
                              );
                              LODOP.SET_PRINT_STYLEA(0, "ItemType", 1);
                              LODOP.SET_PRINT_STYLEA(0, "LinkedItem", 1);
                              LODOP.ADD_PRINT_TABLE(
                                100,
                                "5%",
                                "RightMargin:1cm",
                                500,
                                strStyle +
                                  document.getElementById("div6").innerHTML
                              );
                              // LODOP.SET_PRINT_STYLEA(0, "Offset2Top", -100);
                              LODOP.ADD_PRINT_HTM(
                                "134mm",
                                "15mm",
                                "100mm",
                                "2cm",
                                document.getElementById("div7").innerHTML
                              );
                              LODOP.SET_PRINT_STYLEA(0, "ItemType", 1);
                              LODOP.SET_PRINT_STYLEA(0, "LinkedItem", 4);
                              LODOP.PREVIEW();
                              setTimeout(() => {
                                this.isdisable = false;
                                this.projectNJS = false;
                                this.clearInfo();
                              }, 1000);
                            });
                          })
                          .catch((err) => {
                            console.log(err);
                            this.clearInfo();
                            this.isdisable = false;
                            //
                          });
                      }
                    }
                  }
                }
              }
            }

            //   this.typeInfo.phonenum != "" ||
            //   this.typeInfo.bank != "" ||
            //   this.typeInfo.banknum != ""
            // ) {

            // } else {
            //   this.$message.warning("请填写完整信息！");
            //   this.isdisable = false;
            //   return;
            // }
          }
        }
      } else {
        this.$message.warning("请正确填写结算原因！");
        this.isdisable = false;
        return;
      }

      // if (data.Reason != 5) {
      //   data.Wriwo = this.wriwo;
      // }
      // if (this.radio3 != 1) {
      //   data.Receiver = 2;
      //   data.Relationship;
      //   data.RelationshipType;
      //   data.Rgendercode = this.radio4;
      //   data.Ridentitynum = typeInfo.phonenum;
      //   data.Rbankname = typeInfo.bank;
      //   data.Rbankaccount = typeInfo.banknum;
      //   data.Rphonenum = typeInfo.phonenum;
      // } else {
      //   data.Receiver = 1;
      // }
      // this.project = false;
    },
    changeshow() {
      if (this.radio3 == 1) {
        this.benren = true;
        this.typeInfo.ship = "";
        this.typeInfo.name = "";
        this.typeInfo.idcard = "";
        this.typeInfo.phonenum = "";
        this.typeInfo.address = "";
        this.typeInfo.dres = "";
        this.typeInfo.bank = "";
        this.typeInfo.banknum = "";
        this.radio4 = 1;
      } else if (this.radio3 == 2) {
        this.benren = false;
      }
    },
    changeR() {
      this.checkList = [];
      if (this.radio2 == 1) {
        this.checkList.push("被征地农民出国定居");
        // this.one = true;
        this.$refs.one.setAttribute("checked", "checked");
        this.$refs.two.removeAttribute("checked");
        this.$refs.thr.removeAttribute("checked");
        this.$refs.fou.removeAttribute("checked");
        this.$refs.fiv.removeAttribute("checked");
        this.showqt = true;
        console.log(this.$refs.one);
      } else if (this.radio2 == 2) {
        // this.two = true;
        this.$refs.one.removeAttribute("checked");
        this.$refs.two.setAttribute("checked", "checked");
        this.$refs.thr.removeAttribute("checked");
        this.$refs.fou.removeAttribute("checked");
        this.$refs.fiv.removeAttribute("checked");
        // this.$refs.two.checked = true;
        this.checkList.push("被征地农民死亡");
        this.showqt = true;
      } else if (this.radio2 == 3) {
        // this.thr = true;
        // this.$refs.thr.checked = true;
        this.$refs.one.removeAttribute("checked");
        this.$refs.two.removeAttribute("checked");
        this.$refs.thr.setAttribute("checked", "checked");
        this.$refs.fou.removeAttribute("checked");
        this.$refs.fiv.removeAttribute("checked");
        this.checkList.push("被征地农民达到待遇领取条件");
        this.showqt = true;
      } else if (this.radio2 == 4) {
        // this.fou = true;
        // this.$refs.fou.checked = true;
        this.checkList.push("以灵活就业人员参保并享受待遇");
        this.$refs.one.removeAttribute("checked");
        this.$refs.two.removeAttribute("checked");
        this.$refs.thr.removeAttribute("checked");
        this.$refs.fou.setAttribute("checked", "checked");
        this.$refs.fiv.removeAttribute("checked");
        this.showqt = true;
      } else {
        // this.fiv = true;
        // this.$refs.fiv.checked = true;
        this.checkList.push("其他：");
        this.$refs.one.removeAttribute("checked");
        this.$refs.two.removeAttribute("checked");
        this.$refs.thr.removeAttribute("checked");
        this.$refs.fou.removeAttribute("checked");
        this.$refs.fiv.setAttribute("checked", "checked");
        this.showqt = false;
      }
    },
    changeR5() {
      if (this.radio5 == 7) {
        this.showgx = false;
      } else {
        this.showgx = true;
      }
    },
  },
  created() {
    this.submitProjectName();
    this.submitvill();
    this.user_zd = localStorage.getItem("user");
  },
};
</script>

<style scoped lang="scss">
.accountinfo {
  padding: 30px;
  .el-pagination {
    text-align: right;
    margin-top: 10px;
  }
  .el-drawer__header {
    user-select: none;
  }
  .el-table .success-row {
    background: oldlace;
  }
  .el-dialog__body {
    .el-form {
      ::v-deep .el-form-item__content {
        .el-input {
          width: 150px;
        }
      }
    }
  }
  @media only screen {
    #printTest {
      display: none;
    }
  }
  ::v-deep .el-table {
    // margin-top: 20px;
    .cell {
      // height: 24px !important;
      // padding: 0 !important;
      // line-height: 22px;
    }
    // .el-table__row{
    //   height: 48px;
    // }
    td {
      padding: 6px 0;
    }
  }
  ::v-deep .el-tabs__header {
    margin: 0 !important;
  }
  .elTab {
    // height: calc(100vh - 460px);
    // min-height: 425px;
    .el-table {
      min-height: 360px;
    }
    .el-table-column {
      height: 45px;
    }
    th {
      height: 45px;
    }
  }
  .el-radio-button__inner {
    display: flex;
    .el-icon-search {
      width: 32px !important;
      line-height: 14px;
    }
    span {
      height: 14px !important;
    }
  }

  ::v-deep .el-table-column {
    height: 45px !important;
  }
  ::v-deep .el-table th {
    padding: 10px 0 !important;
  }
  .el-table__header tr,
  .el-table__header th {
    box-sizing: border-box;
    padding: 0 !important;
    height: 45px !important;
    // line-height: 20px !important;
    overflow: hidden;
  }
  ::v-deep .bigBan .el-form-item__content {
    width: 150px;
  }
  ::v-deep .el-dialog__body {
    padding: 30px 50px !important;
  }
  .el-textarea__inner {
    max-height: 56px;
  }
  ::v-deep .el-form .el-form-item__label {
    text-align: left !important;
  }
  :v-deep .el-radio-group {
    width: 360px !important;
  }
  :v-deep .inputcc .el-input,
  .inputcc .el-input__inner {
    width: 290px !important;
  }
  .info {
    display: flex;
  }
  .bigForm {
    box-sizing: border-box;
    width: 600px;
    border-right: 1px solid #000;
    // padding-right: 50px;
    margin-right: 50px;
  }
  .inputcc {
    width: 390px;
    box-sizing: border-box;
    padding-left: 50px !important;
  }
  .max-width-two {
    min-width: 1103px;
  }
  // .el-dialog{
  //   .el-dialog__body{
  //     // padding-top: 0 !important;
  //     .el-table{
  //       // height: 300px;
  //       // max-height: 500px;
  //     }
  //   }
  // }

  // 结算弹框大小控制
  // ::v-deep .el-dialog {
  //   margin-top: 0 !important;
  //   height: 100vh !important;
  // }
}
</style>
